<template>
  <FileImport
    v-if="currentPath === '/network-two/import2'"
    @fileImportResult="fileImportResult"
  />
  <DataList
    v-if="currentPath === '/network-two/import2/list'"
    :dataName="dataName"
    :sendDataName="sendDataName"
  />
  <MergeDataList
    v-if="currentPath === '/network-two/newdata2'"
    :sendDataName="sendDataName"
    :sendConfigName="sendConfigName"
  />
  <!-- <router-view /> -->
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from "vue";
import { useRouter } from "vue-router";
import FileImport from "@/component/fileImport/fileImport.vue";
import DataList from "@/component/fileImport/dataList.vue";
import MergeDataList from "@/component/fileImport/mergeDataList.vue";
import localForage from "localforage";
import { ElMessage } from "element-plus";

const Router = useRouter();

const dataName = ref<string>("dataTwo");
const sendDataName = ref<string>("sendDataTwo");
const sendConfigName = ref<string>("sendConfigNameTwo");
const currentPath = ref<string>("");

watch(
  () => Router.currentRoute.value,
  (nextRouter, prevRouter) => {
    currentPath.value = nextRouter.path;
  }
);

const fileImportResult = async (data: any) => {
  ElMessage({
    type: "success",
    message: "excel 表格数据读取成功，即将进入数据列表页",
    duration: 1000,
  });
  await localForage.setItem(
    dataName.value,
    encodeURIComponent(JSON.stringify(data))
  );
  setTimeout(() => {
    Router.push({
      path: "/network-two/import2/list",
    });
  }, 2000);
};

onMounted(() => {
  currentPath.value = Router.currentRoute.value.path;
});
</script>
